import { Graph } from "@antv/x6";

export default function registerPortLayouts() {
  Graph.registerPortLayout(
    "vue-model-left",
    (portsPositionArgs) => {
      const headerHeight = 20;
      const marginHeight = 10;
      const portHeight = 20;
      return portsPositionArgs.map((_, index) => {
        const y =
          headerHeight + marginHeight * (index + 1) + portHeight * index;
        return {
          position: {
            x: 0,
            y: y,
          },
          angle: 0,
        };
      });
    },
    true
  );
  Graph.registerPortLayout(
    "vue-model-right",
    (portsPositionArgs, elemBBox) => {
      const elemWidth = elemBBox.width;
      const headerHeight = 20;
      const marginHeight = 10;
      const portHeight = 20;
      return portsPositionArgs.map((_, index) => {
        const y =
          headerHeight + marginHeight * (index + 1) + portHeight * index;
        return {
          position: {
            x: elemWidth,
            y: y,
          },
          angle: 0,
        };
      });
    },
    true
  );
  Graph.registerPortLayout("vue-subsystem-left", (portsPositionArgs) => {
    const marginHeight = 10;
    const portHeight = 20;
    return portsPositionArgs.map((_, index) => {
      const y = marginHeight * (index + 1) + portHeight * index;
      return {
        position: {
          x: 0,
          y: y,
        },
        angle: 0,
      };
    });
  });
  Graph.registerPortLayout(
    "vue-subsystem-right",
    (portsPositionArgs, elemBBox) => {
      const elemWidth = elemBBox.width;
      const marginHeight = 10;
      const portHeight = 20;
      return portsPositionArgs.map((_, index) => {
        const y = marginHeight * (index + 1) + portHeight * index;
        return {
          position: {
            x: elemWidth,
            y: y,
          },
          angle: 0,
        };
      });
    }
  );
}
